<template>
	
	<view class="home">
		<HeaderNav bgcolor='rgba(248, 248, 248, 0.5)' text='查看' :showNavBackBtn='false' color='#000'></HeaderNav>
		<view class="in">
			<view style="line-height:150rpx; height: 150rpx;">
				<image src="../../../static/imgs/返回按钮.png" style="width: 36rpx; height: 36rpx;margin-left: 30rpx; margin-top: 20rpx;" @click="BackToCard"></image>
				<text style="font-size: 36rpx; margin-left: 30rpx;">个人信息</text>
			</view>
<!-- 			<view class = "title">
				<image class="head-imgs" src="../../../static/imgs/head_image.jpg"></image>
				<text class ="name">慢慢</text>					
			</view> -->
			<view class="module">
				<view class="message">
					<text>姓名</text>
				</view>
			</view>
			<view class="compile" >
					<textarea disabled="true"  value="777"  auto-height="true"  style=" padding: 25rpx; width: 85%;"></textarea>
					<!-- <image class="img" src="../../../static/imgs/redact.png" ></image> -->
			</view>
			<view class="module">
				<view class="message">
					<text>手机号</text>
				</view>
			</view>
			<view class="compile" >
					<textarea placeholder="15321031347" auto-height="true" maxlength="11" style=" padding: 25rpx; width: 95%;"></textarea>
			</view>
<!-- 			<view class="module">
				<view class="message">
					<text>邮箱地址</text>
				</view>
			</view>
			<view class="compile" >
					<textarea placeholder="2074759654@qq.com" auto-height="true" maxlength="25" style=" padding: 25rpx; width: 95%; line-height: 50rpx;"></textarea>
			</view> -->
		</view>
	</view>
</template>

<script>
	import HeaderNav from '@/common/HeaderNav/HeaderNav'
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			BackToCard(){
				uni.switchTab({
					url:'/pages/card/card'
				})
			}
		},components: {
			HeaderNav
		}
	}
</script>

<style lang ="scss" scoped>
	.home {
		width: 100vw;
		height: 100vh;
		margin-top: 180rpx;
		background: linear-gradient(to top,#060911,#172349,#203f5f,#89a2c4);
	}
	
	.in{
		width:100%;
		height: 100%;
		margin-top: -60rpx;
		background-image:linear-gradient(to bottom right,#0a2894,#0a2894);
	}
	.title{
		position: relative;
		border-bottom: 3rpx solid #b6b6b6;
		width: 100%;
		height: auto;
		line-height: 150rpx;
		
		.head-imgs{
			width: 132rpx;
			height: 132rpx;
			border-radius: 50%;
		}
		
		.name{
			line-height: 100rpx;
			font-size: 32rpx;
			position:absolute;
			/* display: block; */
			height: 132rpx;
			width: 132rpx;
		}

	}
	.module{
		width: 100%;
		height:auto;
	}
	.message{
		width: 90%;
		height: 60rpx;
		margin-left: 5%;
		margin-top: 5%;
		font-size: 30rpx;
	}
	.compile{
		position: relative;
		width: 90%;
		height: auto;
		line-height: 50rpx;
		border-radius: 10rpx;
		box-shadow: inset 0rpx 0rpx 6rpx 0rpx #021B79; 
		margin-top: 15rpx;
		margin-left: 5%;
		font-size: 30rpx;
	}
	.img{
		position: absolute;
		width: 60rpx;
		height: 60rpx;
		line-height: 60rpx;
		margin-top: -90rpx;
		margin-left: 580rpx;
	}
</style>
